<template>
	<view>
		<com-nav-bar left-icon="" :title="title" :fixed="true" :statusBar="true"></com-nav-bar>
		
		<view>
			<view v-if="goodsList" style="display: flex;flex-wrap: wrap;justify-content: space-between;">
				<view v-for="item in goodsList" @click="openUrl(item)" style="width: 47vw;margin: 10rpx;border: 1rpx solid rgb(239, 239, 239);border-radius: 10rpx;">
					<view style="width:47vw;height: 47vw;">
						<image :src="item.cover_pic" mode="aspectFill" style="width: 100%;height: 100%;"></image>
					</view>
					<view style="padding: 20rpx;">
						<view v-line-clamp="2">{{item.name}}</view>
						<view style="text-align: center;color:red;margin-top: 20rpx;">￥{{item.price}}</view>	
					</view>
				</view>
			</view>
			<view v-else style="height: 30vh;display: flex;justify-content: center;align-items: center;">暂无展示商品~</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				title:'',
				mch_id:0,
				goodsList:[]
			}
		},
		
		onLoad(opt){
			this.mch_id = opt.mch_id ?? 0;
			
			this.getPageData()
		},
		methods:{
			async getPageData(){
				uni.showLoading({title:'加载中...'});
				let res = await this.$http.request({
					url: this.$api.moreShop.MchPage,
					method: 'GET',
					data:{mch_id:this.mch_id}
				});
				uni.hideLoading()
				if(res.code !== 0) {
					return this.$http.toast(res.msg);
				}
				this.title = res.data.name;
				this.goodsList = res.data.goods;
			},
			openUrl(goods){
				uni.navigateTo({
					url:'/pages/goods/detail?proId='+goods.goods_id
				})
			},
		},
	}
</script>

<style lang="scss">
	
</style>